body {
	-webkit-transform: translateZ(0);
}

.ArcoObject {
	position: absolute;
	z-index: 10;
}

.ArcoCard {
	border-style: outset;
	border-width: 2px;
}

.played {
	opacity: 0.5;
}

.red {
	background: url("css/images/redstone.png");
	border-color: #ffb0b0;
}

.blue {
	background: url("css/images/bluestone.png");
	border-color: #b0b0ff;
}

.green {
	background: url("css/images/greenstone.png");
	border-color: #b0ffb0;
}

div.Quarry *, div.Magic *, div.Dungeon *{
	position: absolute;
	padding: 3px;
}

.Quarry, .Magic, .Dungeon, .Tower, .Wall {
	text-shadow: none;
}

.Player1 .ResourceProduction {
	bottom: 0px;
	right: 0px;
	font-size: 100%;
}

.Player1 .ResourceAmount {
	top: 0px;
	right: 0px;
	font-size: 250%;
}

.Player1 .ResourceLabel {
	bottom: 0px;
	left: 0px;
}

.Player2 .ResourceProduction {
	bottom: 0px;
	left: 0px;
	font-size: 100%;
}

.Player2 .ResourceAmount {
	top: 0px;
	left: 0px;
	font-size: 250%;
}

.Player2 .ResourceLabel {
	bottom: 0px;
	right: 0px;
}

.ResourceName {
	display: none;
}

div.Tower * {
	position: absolute;
}

.TowerName, .TowerMin, .TowerMax {
	display: none;
}

.TowerHeight {
	bottom: 0px;
	text-align: center;
	width: 100%;
	font-size: 250%;
}

div.Wall * {
	position: absolute;
}

.WallName, .WallMin, .WallMax {
	display: none;
}

.WallHeight {
	bottom: 0px;
	text-align: center;
	width: 100%;
	font-size: 250%;
}

div.ArcoCard {
	opacity: .5;
}

div.ArcoCard.playable {
	opacity: 1;
}

div.ArcoCard * {
	position: absolute;
}

.CardName {
	padding-top: 3px;
	width: 92%;
	text-align: center;
	font-size: 100%;
	margin: 2%;
	height: 8%;
	line-height: 1em;
	margin-bottom: 1.5em;
	border: ridge;
	border-size: 2%;
}

.ArcoCard.red .CardName {
	background-color: #ffbbbb;
	border-color: #ffbbbb;
}

.ArcoCard.blue .CardName {
	background-color: #bbbbff;
	border-color: #bbbbff;
}

.ArcoCard.green .CardName {
	background-color: #bbffbb;
	border-color: #bbffbb;
}

.CardCost {
	bottom: 5%;
	right: 5%;
	padding-right: .5em;
	padding-bottom: .5em;
	font-size: 100%;
	z-index: 12;
}

.ArcoCard .CardCost {
	border-radius: 1em;
	height: .5em;
	width: 1em;
	padding-left: .35em;
	padding-right: .35em;
	padding-top: .5em;
	line-height: .5em;
	text-align: center;
}

.ArcoCard.red .CardCost {
	background-color: #ff8080;
}

.ArcoCard.blue .CardCost {
	background-color: #8080ff;
}

.ArcoCard.green .CardCost {
	background-color: #80ff80;
}

.CardImage {
	width: 92%;
	margin-left: 2%;
	margin-right: 2%;
	height: 27%;
	top: 16%;
	border: ridge;
	border-size: 2%;
}

.red .CardImage {
	border-color: #ffbbbb;
}

.blue .CardImage {
	border-color: #bbbbff;
}

.green .CardImage {
	border-color: #bbffbb;
}

.CardText {
	top: 47%;
	height: 46%;
	text-align: center;
	font-size: 100%;
	border: ridge;
	border-size: 2%;
	z-index: 10;
	width: 88%;
	margin-left: 2%;
	margin-right: 2%;
	padding: 2%;
}

.ArcoCard.red .CardText {
	background-color: #ffbbbb;
	border-color: #ffbbbb;
}

.ArcoCard.blue .CardText {
	background-color: #bbbbff;
	border-color: #bbbbff;
}

.ArcoCard.green .CardText {
	background-color: #bbffbb;
	border-color: #bbffbb;
}

.GameState {
	font-size: 120%;
}